<template>
	<view class="flex_ZC">
		<!-- #ifdef H5 -->
		<uNavbar></uNavbar>
		<!-- #endif -->
		

		<view class="logo flex_c">
			<image :src="baseUrl +'/static/image/logo.png'" mode="aspectFill"></image>
		</view>

		<view class="modular_box mart50 flex_ZC">
			<view class="binding mart50 flex_dq">
				<u-input type="number" placeholder="请输入手机号码" clearable border="bottom" maxlength="32" fontSize='16'
					:placeholderStyle="placeholder" v-model.trim="phone">
					<text slot="prefix" class="slots">账号</text>
				</u-input>
			</view>
			<view class="binding mart50 flex_dq" >
				<u-input type="password" placeholder="请输入密码" clearable border="bottom" maxlength="32" fontSize='16'
					:placeholderStyle="placeholder"  v-model.trim="password">
					<text slot="prefix" class="slots">密码</text>
				</u-input>
			</view>
		</view>
		<view class="forget" @click="goForgetPwd">
			<text>忘记密码?</text>
		</view>
		<view class="signIn1 mart40 flex_c" @click="isComplete">
			<text>登录</text>
		</view>

		<!-- 协议 -->
		<view class="information ">
			<view class="agreement " @click="toggleAgree">
				<image :src="baseUrl +'/static/icon/i_wxz.png'" mode="aspectFill" v-if="!selectStatus"></image>
				<image :src="baseUrl +'/static/icon/i_xz.png'" mode="aspectFill" v-if="selectStatus"></image>
			</view>
			<view class="information_box">
				<text>未注册手机号登录时将自动注册。登录即代表同意</text>
				<text class="underline clause" @click.stop="serviceAgreements">《服务条款》</text>
				<text>和</text>
				<text class="underline clause" @click.stop="privacyPolicy">《隐私政策》</text>
				<text>,并授权福叠猫平台使用此账号进行统一管理</text>
			</view>
		</view>
		<!-- #ifdef H5 -->
		<view class="register " @click="goRegister">
			<text>验证码登录</text>
			<u-icon name="arrow-right" size="16" color="#999999"></u-icon>
		</view>
		<!-- #endif -->
		
	</view>
</template>

<script>
	import {pwdLogin} from "../../api/login.js"
	export default {
		data() {
			return {
				baseUrl: this.$imageBaseUrl,
				phone: '', //手机号
				password: '',
				placeholder: 'color:#999999',
				noPhpne: true,
				check: false, //监听用户是否输入内容
				selectStatus: false, //选中状态

			}
		},
		onLoad(e) {
			console.log(e);
			this.noPhpne = e.noPhpne
		},
		// 监听事件
		watch: {
			phone(val) {
				if (uni.$u.test.mobile(this.phone)) {
					this.check = true
				} else {
					this.check = false
				}
			},
			password(val) {
				if (!uni.$u.test.isEmpty(this.password)) {
					this.check = true
				} else {
					this.check = false
				}
			},
		},
		methods: {
			// 协议
			toggleAgree() {
				this.selectStatus = !this.selectStatus
			},
			goRegister() {
				uni.redirectTo({
					url: '/pageLogin/login/phoneLogin'
				})
			},
			goForgetPwd(){
				uni.navigateTo({
					url: '/pageLogin/login/forgotPassword'
				})
			},
			// 完成
			isComplete() {
				if (!this.selectStatus) {
					uni.$u.toast('请勾选用户协议!');
					return;
				}
				if (!uni.$u.test.mobile(this.phone)) {
					uni.$u.toast('请输入您的手机号');
					return;
				}
				let data = {
					username: this.phone,
					password: this.password,
					agreement:this.selectStatus,
					seller_id:uni.getStorageSync("seller_id")||"",
					mask:1,
					red_id:uni.getStorageSync("red_id")||""
				}
				pwdLogin(data).then(res => {
					console.log(res);
					if (res.code == 1) {
						uni.$u.toast(res.msg);
						uni.setStorageSync('token',res.data.token)
						if(uni.getStorageSync("quick_pay")){
							let url=uni.getStorageSync("quick_pay")
							setTimeout(function() {
								uni.redirectTo({
									url: url
								})
							}, 1500);
						}else{
							let urls = uni.getStorageSync("urls")
							if(urls){
								console.log('返回登录之前的页面---',urls);
								uni.removeStorageSync('urls');
								setTimeout(function() {
									uni.redirectTo({
										url:urls
									})
								}, 1500);
							}else{
								setTimeout(function() {
									uni.switchTab({
										url: '/pages/index/cloudCatIndex'
									})
								}, 1500);
							}
						}
					} else {
						uni.$u.toast(res.msg);
					}
				})
			},
			// 服务协议
			serviceAgreements(){
				uni.navigateTo({
					url:'/pageUser/myuser/servicerule'
				})
			},
			// 隐私协议
			privacyPolicy(){
				uni.navigateTo({
					url:'/pageUser/myuser/privacyrule'
				})
			},
		},
	}
</script>

<style>
	page {
		background: #ffffff;
	}
</style>
<style scoped>
	.logo {
		width: 690rpx;
		margin-top: 270rpx;
	}

	.logo>image {
		width: 226rpx;
		height: 242rpx;
	}

	.modular_box {
		width: 92%;
		position: relative;
	}

	.mart50 {
		margin-top: 50rpx;
	}

	.binding {
		width: 90%;
	}

	.slots {
		font-size: 32rpx;
		color: #333333;
		margin-right: 10rpx;
	}

	.forget {
		width: 90%;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		font-size: 26rpx;
		color: #666666;
		margin-top: 44rpx;
	}

	.signIn1 {
		width: 690rpx;
		height: 80rpx;
		color: #ffffff;
		background: linear-gradient( 180deg, #FD9609 0%, #FFBA02 97%);
		border-radius: 36rpx;
		font-size: 32rpx;
	}

	.mart40 {
		margin-top: 40rpx;
	}

	.information {
		display: flex;
		width: 690rpx;
		margin-top: 68rpx;
	}

	.information_box {
		margin-left: 14rpx;
	}

	.information_box>text {
		color: #999999;
		font-size: 24rpx;
	}

	.clause {
		color: #FFC300 !important;
	}

	.agreement>image {
		width: 32rpx;
		height: 32rpx;
		margin-top: 10rpx;
	}

	.register {
		display: flex;
		align-items: baseline;
		justify-content: center;
		width: 100%;
		/* position: fixed; */
		/* bottom: 50rpx; */
		margin-top: 260rpx;
		font-size: 30rpx;
		color: #999999;
	}

	/deep/.u-button--success {
		background: none !important;
		border: none !important;
		color: #FFC300 !important;
	}

	/deep/.u-button__text {
		font-size: 28rpx !important;
	}
</style>